<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<ul>
    <li id="li1">我是参照标签</li>
</ul>

<script>
    var ul = document.getElementsByTagName("ul")[0];
    var li1 = document.getElementById("li1");
    var li2 = document.createElement('li');
    li2.innerText = "我是createElement创建的标签，用的是appendChild的方法添加的";
    ul.appendChild(li2);
    var li3 = document.createElement("li");
    li3.innerText = "我是createElement创建的标签，用的是insertBefore的方法添加的"
    //父节点.insertBefore(新节点，参照节点);
    ul.insertBefore(li3,li1);
    ul.removeChild(li3);
    ul.replaceChild(li3,li2);
    for(var i=0;i<=3;i++){
        var newLi = li3.cloneNode(true);
        ul.appendChild(newLi);
    }
</script>
</body>
</html>